import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_soundmagus/util/util.dart';
import 'package:flutter_soundmagus/extension/text_editing_controller.dart';

export 'zfbutton.dart';
export 'zftextbutton.dart';
export 'zflistview.dart';
export 'vslider.dart';
export 'zfch_view.dart';
export 'zfswitch.dart';
export 'zftab.dart';
export 'circular_slider.dart';
export './gesture_detector_ext.dart';
export './enable_container.dart';

BoxDecoration borderDecoration({double radius = 4, Color borderColor = Colors.white}) => BoxDecoration(
    borderRadius: BorderRadius.circular(radius),
    border: Border.all(
      color: borderColor,
      width: 1,
    ));

class ZFCheckBox extends StatelessWidget {
  final bool value;
  const ZFCheckBox({Key? key, this.value = false}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final color = value ? Theme.of(context).colorScheme.secondary : Colors.white;
    return Container(
      width: 12,
      height: 12,
      decoration: BoxDecoration(border: Border.all(color: color, width: 2)),
    );
  }
}

extension ImageExt on Image {
  ///取得本地图片
  static Image zfasset(String name, {double? width, double? height, BoxFit? fit}) {
    String image = name;
    if (!image.contains('asset/images/')) {
      image = 'asset/images/$name.png';
    }
    return Image.asset(image, width: width, height: height, fit: fit);
  }
}

extension AssetImageExt on AssetImage {
  ///取得本地图片
  static AssetImage zfasset(String name, {double? width, double? height, BoxFit? fit}) {
    String image = name;
    if (!image.contains('asset/images/')) {
      image = 'asset/images/$name.png';
    }
    return AssetImage(
      image,
    );
  }
}

///下划线装饰
kBottomLineDecoration({Color? color}) =>
    BoxDecoration(border: Border(bottom: BorderSide(color: color ?? Colors.white24)));

final kArrowDown = ImageExt.zfasset(
  'icon_arrow_down',
  width: 8,
  height: 12,
);

///带单位的文本
class UnitText extends StatelessWidget {
  final String text;
  final bool editEnable;
  final TextEditingController? controller;
  final FocusNode? focusNode;
  final TextStyle? textStyle;
  final String? unit;
  final String? prefix;
  final TextStyle? unitStyle;
  final void Function()? onEditingComplete;
  const UnitText({
    Key? key,
    required this.text,
    this.unit,
    this.textStyle,
    this.unitStyle,
    this.editEnable = false,
    this.focusNode,
    this.prefix,
    this.controller,
    this.onEditingComplete,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    Widget textChild;
    final color = TextStyle(color: Theme.of(context).textTheme.bodyLarge?.color).color ?? Colors.white;
    if (editEnable) {
      //可编辑文本输入框
      textChild = SizedBox(
        width: 60.w,
        height: 20,
        child: TextField(
          controller: controller?..zftext = text,
          textAlign: TextAlign.center,
          focusNode: focusNode,
          onEditingComplete: onEditingComplete,
          keyboardType: TextInputType.numberWithOptions(signed: true, decimal: false), //为了iOS上有完成按钮（数字键盘无完成按钮问题）
          inputFormatters: [FilteringTextInputFormatter.digitsOnly], //只允许数字
          decoration: InputDecoration(
            contentPadding: EdgeInsets.zero,
            enabledBorder: OutlineInputBorder(borderSide: BorderSide(color: color)),
            border: OutlineInputBorder(borderSide: BorderSide(color: Colors.white)),
          ),
          style: textStyle ??
              TextStyle(
                fontSize: 10,
                color: Colors.white,
                fontWeight: FontWeight.bold,
              ),
        ),
      );
    } else {
      textChild = Text(
        text,
        style: textStyle ?? TextStyle(fontSize: 14, color: Colors.white),
      );
    }
    var children = [textChild];
    if (unit != null) {
      children.add(SizedBox(
        width: 60,
        child: Text(
          unit!,
          textAlign: TextAlign.left,
          style: unitStyle ?? TextStyle(color: Theme.of(context).textTheme.bodyLarge?.color),
        ),
      ));
    }
    if (prefix != null) {
      children.insert(
        0,
        SizedBox(
          width: 60,
          child: Text(
            prefix!,
            textAlign: TextAlign.right,
            style: unitStyle ?? TextStyle(color: Theme.of(context).textTheme.bodyLarge?.color),
          ),
        ),
      );
    }
    return Row(
      crossAxisAlignment: CrossAxisAlignment.center,
      mainAxisSize: MainAxisSize.min,
      children: children,
    );
  }
}

class Xielv extends StatelessWidget {
  final int index;
  final void Function(int i)? onPress;
  const Xielv({Key? key, this.index = 0, this.onPress}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    /**
     *   更改：把斜率的SLOPE改成：6.12.16.18.24
     */
    final list = [6, 12, 16, 18, 24];
    return Row(
      mainAxisSize: MainAxisSize.min,
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        SizedBox(
          width: 60,
          child: Text(
            'Slope',
            textAlign: TextAlign.right,
            style: TextStyle(color: Theme.of(context).textTheme.bodyLarge?.color),
          ),
        ),
        SizedBox(
          width: 60.w,
          height: 20.w * list.length,
          child: CupertinoPicker(
            key: GlobalKey(),
            scrollController: FixedExtentScrollController(initialItem: index),
            magnification: 1.0,
            squeeze: 1.5,
            useMagnifier: true,
            itemExtent: 20.w,
            onSelectedItemChanged: (int selectedItem) {
              onPress?.call(selectedItem);
            },
            children: List<Widget>.generate(list.length, (int i) {
              final selColor = Color(0xff191A1B);
              return Container(
                width: 60.w,
                height: 20.w,
                alignment: Alignment.center,
                color: index == i ? selColor : Colors.transparent,
                child: Text(
                  list[i].toString(),
                  textAlign: TextAlign.center,
                  style: TextStyle(fontSize: 10, color: Colors.white),
                ),
              );
            }),
          ),
        ),
        // Column(
        //   mainAxisAlignment: MainAxisAlignment.spaceBetween,
        //   children: [
        //     ...list.map((e) {
        //       final selColor = Color(0xff191A1B);
        //       return GestureDetector(
        //         onTap: () => onPress?.call(list.indexOf(e)),
        //         child: Container(
        //           width: 60.w,
        //           height: 20,
        //           alignment: Alignment.center,
        //           color: list[index] == e ? selColor : Colors.transparent,
        //           child: Text(
        //             e.toString(),
        //             textAlign: TextAlign.center,
        //             style: TextStyle(fontSize: 12, color: Colors.white),
        //           ),
        //         ),
        //       );
        //     }),
        //   ],
        // ),
        SizedBox(
          width: 60,
          child: Text(
            'dB/Oct',
            textAlign: TextAlign.left,
            style: TextStyle(color: Theme.of(context).textTheme.bodyLarge?.color),
          ),
        ),
      ],
    );
  }
}
